<template>
    <el-dialog title="" visible :show-close="false" class="wrap" size="tiny">
       <i class="el-icon-close close" @click="cancel" style="color: white;z-index: 99;"></i>
		 <div class="bt">结算</div>
        <el-form label-width="100px" class="form">
            <el-form-item label="老师名称">
                <el-input v-model="params.row.zwm" :readonly="true" class="select-block"></el-input>
            </el-form-item>
      <table class="tables" style="margin: 0 auto;width: 100%;">
        <tr class="trs">
            <td class="tds"></td>
            <td class="tds">主教</td>
            <td class="tds">助教</td>
            <td class="tds">补课</td>
        </tr>
        <tr class="trs">
            <td class="tds">未结算次数</td>
            <td class="tds" style="padding-left: 16px;">{{form.zjcs1}}</td>
            <td class="tds" style="padding-left: 16px;">{{form.zjcs2}}</td>
            <td class="tds" style="padding-left: 16px;">{{form.bkcs}}</td>
        </tr>
         <tr class="trs">
            <td class="tds">本次结算次数</td>
            <td class="tds"><el-input v-model="zjcs3" type="number" placeholder="请输入" class="select-block"></el-input></td>
            <td class="tds"><el-input v-model="zjcs4" type="number" placeholder="请输入" class="select-block"></el-input></td>
            <td class="tds"><el-input v-model="bkcs1" type="number" placeholder="请输入" class="select-block"></el-input>  </td>
        </tr>
         <tr class="trs">
            <td class="tds">本次结算金额</td>
            <td class="tds"><el-input v-model="form.zjje1" type="number" placeholder="请输入" class="select-block"></el-input></td>
            <td class="tds"><el-input v-model="form.zjje2" type="number" placeholder="请输入" class="select-block"></el-input></td>
            <td class="tds"><el-input v-model="form.bkje" type="number" placeholder="请输入" class="select-block"></el-input></td>
        </tr>
		</table>
		<!--<div style="color: red;">注：必须全部填写，不用的请填0！</div>-->    	
        </el-form>
        <el-button type="primary" class="submit" @click="submit">结算</el-button>
        <el-button type="danger" class="submit" @click="cancel">退出</el-button>
        
    </el-dialog>
</template>

<script type="text/javascript">
    import qs from 'qs'
    export default {
        props: ['params'],
        data () {
            return {
                form: {
                	lsid:'',
                    zjje1: '',
                    zjje2: '',
                    bkje:'',
                    id:''
                },
                 zjcs3: '',
                 zjcs4: '',
                 bkcs1:'',
            }
        },
        created () {
            this.form.id=this.params.row.id;
            this.form.lsid=this.params.row.lsid;
			this.loadinfo();
        },
        watch:{
            'zjcs3': function(newVal,oldVal){
                if(parseInt(newVal) > parseInt(this.form.zjcs1)) {//如果小于等于零
//                  this.tfje = this.form.yuer//恢复原值
					this.zjcs3 = 0
                     this.$message.warning('输入的次数超过未结算次数!')
                }
            },
            'zjcs4': function(newVal,oldVal){
                if(parseInt(newVal) > parseInt(this.form.zjcs2)) {//如果小于等于零
//                  this.tfje = this.form.yuer//恢复原值
					this.zjcs4 = 0
                     this.$message.warning('输入的次数超过未结算次数!')
                }
            },
            'bkcs1': function(newVal,oldVal){
                if(parseInt(newVal) > parseInt(this.form.bkcs)) {//如果小于等于零
//                  this.tfje = this.form.yuer//恢复原值
					this.bkcs1 = 0
                     this.$message.warning('输入的次数超过未结算次数!')
                }
            }
        },
        methods: {
      loadinfo(){
        		var logininfo = JSON.parse(localStorage.logininfo);
                var params2 = qs.stringify({
                             xxid:logininfo.xxid,
 							 yhid:logininfo.id,
 							 id:this.form.id
               })
             //执行
                 this.axios.post(this.$store.state.api + 'lsks/info',  params2 )
                 .then(res => {
 							this.form=res.data.data
                 }).catch(res => {
					this.$message.warning("服务器异常");
 			 				this.$emit('close', { type: 'info', cancel: true });
				})
			},
            submit () {

                var cont=0;
                if (this.zjcs3>0 && this.form.zjje1>0) {
                	cont=cont+1;
                }else if(this.zjcs4>0 && this.form.zjje2>0){
                    cont=cont+1;
                }else if(this.bkcs1>0 && this.form.bkje>0){
                    cont=cont+1;
                }
                if(cont==0){
                    this.$message.warning('请至少结算一个类型！');
                    return;
                }
//				alert(cont)
//                  return;
//	
               var logininfo = JSON.parse(localStorage.logininfo);
               var params2 = qs.stringify({
                        lsid: this.form.lsid+'',
                        zjcs1: this.zjcs3+'',
                        zjje1: this.form.zjje1+'',
                        zjcs2: this.zjcs4+'',
                        zjje2: this.form.zjje2+'',
                        bkcs: this.bkcs1+'',
                        bkje: this.form.bkje+'',
                        xxid: logininfo.xxid+'',
                        yhid: logininfo.id+''
               })
             //执行
                 this.axios.post(this.$store.state.api + 'lsksjs/insert',  params2 )
                 .then(res => {
                    if (res.data.code == 1) {
                        this.$emit('close',{type:'edit',cancel:false});
                        this.$message.success(res.data.msg);
                        this.$store.state.loading = false;
                    }else{
                    	this.$message.success(res.data.msg);
                        this.$store.state.loading = false;
                    }
                 }).catch(res => {
                    this.$message.danger("服务器异常!")
                    this.$store.state.loading = false;
				})
            },
            cancel () {
                this.$emit('close',{type:'edit',cancel:true})
            },
        }
    }
</script>

<style lang="less" scoped>
    .wrap {
        text-align: center;
    }
   .bt{
		position: absolute;
			width: 100%;
			height: 50px;
			margin: 0 auto;
			top:0;
			left:0;
			background: #50BFFF;
			margin-bottom: 20px;
			color:white;
			text-align:left;
			line-height: 50px;
			font-size: 17px;
			padding-left: 15px;
		}
    .form {
        text-align: left;
        margin-top: 20px;
        margin-bottom: 20px;

    }
    .close {
    position: absolute;
    top: 15px;
    right: 20px;
    color: #8492A6;
    font-size: 16px;
}
    .input {
             display: inline-block;
         }
    .select-block {
        display: block;
        width: 100%;
        text-align: center;
    }
    .submit {
        width: 120px;
    }
    .tables{
          border-collapse:collapse;
          background-color: #fff;
      }
      .tds{
      	width: 2%;
      	text-align: center;
          border: 1px solid #CCCCCC;
      }
</style>
